import { createRouter, createWebHashHistory } from "vue-router";
import { useUserStore } from "@/stores/modules/user";
import { useAuthStore } from "@/stores/modules/auth";
import { LOGIN_URL, ROUTER_WHITE_LIST, HOME_URL } from "@/config";
import { initDynamicRouter } from "@/routers/modules/dynamicRouter";
import { staticRouter, errorRouter, mobileRouter } from "@/routers/modules/staticRouter";
import NProgress from "@/config/nprogress";

const ssoServer = "http://31.16.7.200"; //DF SSO登录地址
//const clientServerAddr = "http://192.168.129.145:8848"; //DF SSO登录成功后回调地址
//const clientServerAddr = "http://192.168.1.29:8848"; //DF SSO登录成功后回调地址
const clientServerAddr = "http://31.16.7.142:9000"; //DF SSO登录成功后回调地址

/**
 * @description 📚 路由参数配置简介
 * @param path ==> 路由菜单访问路径
 * @param name ==> 路由 name (对应页面组件 name, 可用作 KeepAlive 缓存标识 && 按钮权限筛选)
 * @param redirect ==> 路由重定向地址
 * @param component ==> 视图文件路径
 * @param meta ==> 路由菜单元信息
 * @param meta.icon ==> 菜单和面包屑对应的图标
 * @param meta.title ==> 路由标题 (用作 document.title || 菜单的名称)
 * @param meta.activeMenu ==> 当前路由为详情页时，需要高亮的菜单
 * @param meta.isLink ==> 路由外链时填写的访问地址
 * @param meta.isHide ==> 是否在菜单中隐藏 (通常列表详情页需要隐藏)
 * @param meta.isFull ==> 菜单是否全屏 (示例：数据大屏页面)
 * @param meta.isAffix ==> 菜单是否固定在标签页中 (首页通常是固定项)
 * @param meta.isKeepAlive ==> 当前路由是否缓存
 * */
const router = createRouter({
  history: createWebHashHistory(),
  routes: [...staticRouter, ...errorRouter, ...mobileRouter],
  scrollBehavior: () => ({ left: 0, top: 0 })
});

/**
 * @description 路由拦截 beforeEach
 * */
router.beforeEach(async (to, from, next) => {
  // 判断是否跳转到移动端
  if (to.query.M) {
    sessionStorage.setItem("pageNum", to.query.M as any); //页面标识
    // sessionStorage.setItem("M-query", JSON.stringify(to.query));
    switch (to.query.M) {
      case "1":
        sessionStorage.setItem("list-query", JSON.stringify(to.query));
        break;
      case "2": // 单条数据列表
        sessionStorage.setItem("detail-query", JSON.stringify(to.query));
        break;
    }
  }
  const userStore = useUserStore();
  const authStore = useAuthStore();

  // 1.NProgress 开始
  NProgress.start();

  // // 2.动态设置标题
  const title = import.meta.env.VITE_GLOB_APP_TITLE;
  document.title = to.meta.title ? `${to.meta.title} - ${title}` : title;

  // 处理 DF_SSO 此功能在路由守卫中添加是因为sso重定向的url不会含有哈希值，会导致页面最终还是会重定向到登录页
  let ticket: string = (to.query.ticket as any) || getQueryLocationFrom("ticket");
  if (ticket) {
    // 清除 url 中的 ticket 参数，避免重复触发
    if (getQueryLocationFrom("ticket")) {
      const clearUrl = `${window.location.origin}${window.location.pathname}${window.location.hash}`;
      // 把当前页面URL替换成不含有ticket的URL
      console.log("clearUrl", clearUrl);
      window.history.replaceState({}, document.title, clearUrl);
    }

    try {
      //组织验证ticket是不正确的SSO_URL
      const url = "/validate?ticket=" + ticket + "&service=" + decodeURI(clientServerAddr);
      // 调用url接口去认证，从而取到用户名
      const response = await userStore.ssoLogin(url);
      console.log("response", response);

      if (response.indexOf("yes") != -1) {
        //yes表示通过了
        console.log("SSO 登录成功，设置 userName");
        // 成功返回的内容会含有换行及用户名，所以需要截取，并取第2项
        const userName = response.split("\n")[1];
        return next({ path: "/loginJump", query: { name: userName }, replace: true });
      } else if (response.replace("\n", "").trim() == "no") {
        console.log("ticket验证失败，重定向到第三方的SSO单点登录页");
        ssoErrHandle(to.query.page as string);
      } else {
        // 调用API异常错误
        console.error("调用API异常错误");
      }
    } catch (error) {
      console.error("调用API异常或程序异常错误:", error);
      ssoErrHandle(to.query.page as string);
    }
    return;
  }

  // // 3.判断是访问登陆页，有 Token 就在当前页面，没有 Token 重置路由到登陆页
  if (to.path.toLocaleLowerCase() === LOGIN_URL) {
    if (userStore.token) return next();
    resetRouter();
    return next();
  }
  // // 4.判断访问页面是否在路由白名单地址(静态路由)中，如果存在直接放行
  if (ROUTER_WHITE_LIST.includes(to.path)) return next();

  // // 5.判断是否有 Token，没有重定向到 login 页面
  if (!userStore.token) return next({ path: LOGIN_URL, replace: true });

  // 6.如果没有菜单列表，就重新请求菜单列表并添加动态路由
  if (!authStore.authMenuListGet.length) {
    await initDynamicRouter();
    return next({ ...to, replace: true });
  }

  // // 7.存储 routerName 做按钮权限筛选
  // authStore.setRouteName(to.name as string);

  // 8.正常访问页面
  next();
});

// 获取url中包含key参数值
const getQueryLocationFrom = (key: string) => {
  const params = new URLSearchParams(window.location.search);
  return params.get(key);
};

// DF_SSO认证失败处理，从定向到第三方的SSO单点登录页
const ssoErrHandle = async (page: string) => {
  let url = ssoServer + "/login?service=" + encodeURI(clientServerAddr);
  if (page) {
    url += "?page=" + page;
  }
  console.log("url", url);
  location.href = url;
};

/**
 * @description 重置路由
 * */
export const resetRouter = () => {
  const authStore = useAuthStore();
  authStore.flatMenuListGet.forEach((route: any) => {
    console.log(route);

    const { name } = route;
    if (name && router.hasRoute(name)) router.removeRoute(name);
  });
};

/**
 * @description 路由跳转错误
 * */
router.onError(error => {
  NProgress.done();
  console.warn("路由错误", error.message);
});

/**
 * @description 路由跳转结束
 * */
router.afterEach(() => {
  NProgress.done();
});

export default router;
